<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>考试结果测试页面</title>
    <style>
        body { font-family: Arial, sans-serif; margin: 20px; }
        .test-section { margin: 20px 0; padding: 15px; border: 1px solid #ccc; border-radius: 5px; }
        .test-result { margin: 10px 0; padding: 10px; background: #f5f5f5; border-radius: 3px; }
        .success { background: #d4edda; color: #155724; }
        .error { background: #f8d7da; color: #721c24; }
        button { padding: 10px 20px; margin: 5px; background: #007bff; color: white; border: none; border-radius: 3px; cursor: pointer; }
        button:hover { background: #0056b3; }
    </style>
</head>
<body>
    <h1>考试结果分析页面测试</h1>
    
    <div class="test-section">
        <h2>测试说明</h2>
        <p>这个页面用于测试老师端考试结果分析功能是否正常工作。</p>
        <p>请确保：</p>
        <ul>
            <li>后端服务正在运行</li>
            <li>已经登录了老师账号</li>
            <li>有考试数据存在</li>
        </ul>
    </div>

    <div class="test-section">
        <h2>API测试</h2>
        <button onclick="testAPI()">测试API连接</button>
        <button onclick="testExamList()">测试考试列表</button>
        <button onclick="testExamResults()">测试考试结果</button>
        <div id="apiResults"></div>
    </div>

    <div class="test-section">
        <h2>页面跳转测试</h2>
        <button onclick="goToExamResults()">跳转到考试结果页面</button>
        <p>请在URL中添加examId参数，例如：?examId=1</p>
    </div>

    <script>
        // 测试API连接
        async function testAPI() {
            const resultsDiv = document.getElementById('apiResults');
            resultsDiv.innerHTML = '<div class="test-result">正在测试API连接...</div>';
            
            try {
                const response = await fetch('/api/exam/teacher/list', {
                    credentials: 'same-origin'
                });
                
                if (response.ok) {
                    const data = await response.json();
                    resultsDiv.innerHTML = `<div class="test-result success">API连接成功！返回数据：${JSON.stringify(data)}</div>`;
                } else {
                    resultsDiv.innerHTML = `<div class="test-result error">API连接失败，状态码：${response.status}</div>`;
                }
            } catch (error) {
                resultsDiv.innerHTML = `<div class="test-result error">API连接错误：${error.message}</div>`;
            }
        }

        // 测试考试列表
        async function testExamList() {
            const resultsDiv = document.getElementById('apiResults');
            resultsDiv.innerHTML = '<div class="test-result">正在测试考试列表...</div>';
            
            try {
                const response = await fetch('/api/exam/teacher/list', {
                    credentials: 'same-origin'
                });
                
                if (response.ok) {
                    const data = await response.json();
                    if (data.success && data.exams && data.exams.length > 0) {
                        resultsDiv.innerHTML = `<div class="test-result success">考试列表获取成功！找到 ${data.exams.length} 个考试</div>`;
                    } else {
                        resultsDiv.innerHTML = `<div class="test-result error">没有找到考试数据</div>`;
                    }
                } else {
                    resultsDiv.innerHTML = `<div class="test-result error">获取考试列表失败，状态码：${response.status}</div>`;
                }
            } catch (error) {
                resultsDiv.innerHTML = `<div class="test-result error">获取考试列表错误：${error.message}</div>`;
            }
        }

        // 测试考试结果
        async function testExamResults() {
            const resultsDiv = document.getElementById('apiResults');
            resultsDiv.innerHTML = '<div class="test-result">正在测试考试结果...</div>';
            
            // 首先获取考试列表
            try {
                const examResponse = await fetch('/api/exam/teacher/list', {
                    credentials: 'same-origin'
                });
                
                if (examResponse.ok) {
                    const examData = await examResponse.json();
                    if (examData.success && examData.exams && examData.exams.length > 0) {
                        const examId = examData.exams[0].id;
                        
                        // 测试考试结果API
                        const resultResponse = await fetch(`/api/exam/teacher/answers/${examId}`, {
                            credentials: 'same-origin'
                        });
                        
                        if (resultResponse.ok) {
                            const resultData = await resultResponse.json();
                            if (resultData.success) {
                                const recordCount = resultData.records ? resultData.records.length : 0;
                                const answerCount = resultData.answers ? resultData.answers.length : 0;
                                resultsDiv.innerHTML = `<div class="test-result success">考试结果获取成功！考试ID: ${examId}, 记录数: ${recordCount}, 答题数: ${answerCount}</div>`;
                            } else {
                                resultsDiv.innerHTML = `<div class="test-result error">考试结果API返回失败：${resultData.message}</div>`;
                            }
                        } else {
                            resultsDiv.innerHTML = `<div class="test-result error">考试结果API请求失败，状态码：${resultResponse.status}</div>`;
                        }
                    } else {
                        resultsDiv.innerHTML = `<div class="test-result error">没有找到考试数据，无法测试考试结果</div>`;
                    }
                } else {
                    resultsDiv.innerHTML = `<div class="test-result error">获取考试列表失败，无法测试考试结果</div>`;
                }
            } catch (error) {
                resultsDiv.innerHTML = `<div class="test-result error">测试考试结果错误：${error.message}</div>`;
            }
        }

        // 跳转到考试结果页面
        function goToExamResults() {
            const examId = prompt('请输入考试ID:');
            if (examId) {
                window.location.href = `/teacher/exam-results.html?examId=${examId}`;
            }
        }
    </script>
</body>
</html>
